<template>
  <view class="related-content">
    <view class="top-block view-block">
      <uni-section title="实时信息" type="line" titleColor=" #102C59" titleFontSize="32rpx"></uni-section>

      <view class="list-card card-bg">
        <view class="list-title">
          <i class="icon"></i>
          <text class="txt">5m提升机</text>
        </view>

        <uni-row class="row-list" :gutter="60">
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">电机电压：</text>
            </view>
            <view class="val">{{ dataObj.djdy || 0 }} V</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">电机电流：</text>
            </view>
            <view class="val">{{ dataObj.djdl || 0 }} A</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">容器位置：</text>
            </view>
            <view class="val">{{ dataObj.zjrqwz || 0 }} m</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">提升速度：</text>
            </view>
            <view class="val">{{ dataObj.zjtssd || 0 }} m/s</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">本次打点：</text>
            </view>
            <view class="val">{{ dataObj.bcdd || 0 }}</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">上次打点：</text>
            </view>
            <view class="val">{{ dataObj.scdd || 0 }}</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">高压电源电压：</text>
            </view>
            <view class="val">{{ dataObj.gydydy || 0 }} V</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">低压电源电压：</text>
            </view>
            <view class="val">{{ dataObj.dydydy || 0 }} V</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">制动油压：</text>
            </view>
            <view class="val">{{ dataObj.zdyy || 0 }} Mpa</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">润滑油压：</text>
            </view>
            <view class="val">{{ dataObj.rhyy || 0 }} Mpa</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">制动油温：</text>
            </view>
            <view class="val">{{ dataObj.zdyw || 0 }} Mpa</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">润滑油温：</text>
            </view>
            <view class="val">{{ dataObj.rhyw || 0 }} Mpa</view>
          </uni-col>
        </uni-row>
      </view>

      <view class="list-card card-bg-s">
        <view class="list-title">
          <i class="icon"></i>
          <text class="txt">3.2m提升机</text>
        </view>

        <uni-row class="row-list" :gutter="60">
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">主机行程：</text>
            </view>
            <view class="val">{{ handleVal(dataObj2.t_180018, 0.1) }} m</view>
          </uni-col>

          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">提升速度：</text>
            </view>
            <view class="val">{{ handleVal(dataObj2.t_180014 , 0.01 )}} m/s</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">本次打点：</text>
            </view>
            <view class="val">{{ dataObj2.t_180001 || 0 }}</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">监机提升速度：</text>
            </view>
            <view class="val">{{ handleVal(dataObj2.t_180004,0.01) }}m/s</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">制动油压：</text>
            </view>
            <view class="val">{{ handleVal(dataObj2.t_180017, 0.01) }} Mpa</view>
          </uni-col>

          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">润滑油压：</text>
            </view>
            <view class="val">{{ handleVal(dataObj2.t_180008,0.00000016, 2) }} Mpa</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">监机行程：</text>
            </view>
            <view class="val">{{ handleVal(dataObj2.t_180005, 0.1) }} m</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">实际井深：</text>
            </view>
            <view class="val">{{ handleVal(dataObj2.t_180007, 0.1) }} m</view>
          </uni-col>
        </uni-row>
      </view>

      <view class="list-card card-bg-s">
        <view class="list-title">
          <i class="icon"></i>
          <text class="txt">4m提升机</text>
        </view>

        <uni-row class="row-list" :gutter="60">
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">主机行程：</text>
            </view>
            <view class="val">{{ handleVal(dataObj3.t_170018, 0.1) }} m</view>
          </uni-col>

          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">提升速度：</text>
            </view>
            <view class="val">{{ handleVal(dataObj3.t_170014 , 0.01 )}} m/s</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">本次打点：</text>
            </view>
            <view class="val">{{ dataObj3.t_170001|| 0 }}</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">监机提升速度：</text>
            </view>
            <view class="val">{{ handleVal(dataObj3.t_170004, 0.01)}}m/s</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">制动油压：</text>
            </view>
            <view class="val">{{ handleVal(dataObj3.t_170017, 0.01) }} Mpa</view>
          </uni-col>

          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">润滑油压：</text>
            </view>
            <view class="val">{{ handleVal(dataObj3.t_170008,0.00000016, 2) }} Mpa</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">监机行程：</text>
            </view>
            <view class="val">{{ handleVal(dataObj3.t_170005, 0.1) }} m</view>
          </uni-col>
          <uni-col :span="12" class="col-item">
            <view class="lab-b">
              <image class="icon" src="/static/images/fillout/list-tip.png" mode=""></image>
              <text class="lab">实际井深：</text>
            </view>
            <view class="val">{{ handleVal(dataObj3.t_170007, 0.1) }} m</view>
          </uni-col>
        </uni-row>
      </view>
    </view>
  </view>
</template>

<script>
import { getHoistLeft } from '@/api/home.js';
import { getDeviceRunInfo } from '@/api/monitorCenter/index.js';

export default {
  data() {
    return {
      dataObj: {},
      dataObj2: {},
      dataObj3: {}
    };
  },
  computed: {
    handleVal() {
      return (val, mul = 0.1, fix = 10) => {
        if (val && val != '--') {
          return parseFloat((Number(val) * Number(mul)).toFixed(fix));
        } else {
          return val || '--';
        }
      };
    }
  },
  created() {
    this.getData();
  },
  methods: {
    getData() {
      getHoistLeft().then((res) => {
        this.dataObj = res.data;
      });
      getDeviceRunInfo('n_ftsj').then((res) => {
        this.dataObj2 = res.data;
      });
      
      getDeviceRunInfo('b_ftsj').then((res) => {
        this.dataObj3 = res.data;
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.related-content {
  overflow-y: auto;
  
  .top-block {
    // box-shadow: 0rpx -15rpx 21rpx -5rpx rgba(0, 0, 0, 0.25);
    border-radius: 20rpx 20rpx 0rpx 0rpx;
  }

  .view-block {
    background: #fff;
    padding: 20rpx 36rpx;
    margin-bottom: 40rpx;
  }
  .card-bg {
    height: 500rpx;
    background: url('/static/images/monitor/ts-list-card.png') no-repeat;
    background-size: 100%;
  }
  .card-bg-s {
    height: 374rpx;
    background: url('/static/images/monitor/ts-list-card-s.png') no-repeat;
    background-size: 100%;
  }
  .list-card {
    width: 100%;
    margin-bottom: 40rpx;

    .list-title {
      height: 64rpx;
      display: flex;
      align-items: center;
      font-weight: 500;
      font-size: 32rpx;
      color: #ffffff;
      padding: 0 20rpx;
      .icon {
        width: 10rpx;
        height: 10rpx;
        border-radius: 50%;
        background: #ffffff;
      }
      .txt {
        padding-left: 10rpx;
      }
    }

    .row-list {
      padding: 36rpx 26rpx 0 19rpx;
      .col-item {
        font-size: 24rpx;
        display: flex;
        justify-content: space-between;
        padding-bottom: 30rpx;
      }
      .lab-b {
        .icon {
          width: 22rpx;
          height: 13rpx;
        }

        .lab {
          padding-left: 5rpx;
          color: rgba(16, 44, 89, 0.5);
        }
      }
      .val {
        color: rgba(16, 44, 89, 1);
      }
    }
  }
}

::v-deep .uni-section .uni-section-header {
  padding: 0 0 30rpx 0;
}
</style>
